<!--
 * @Description: DOM
 * @Author: rendc
 * @Date: 2021-09-06 09:11:38
 * @LastEditors: rendc
 * @LastEditTime: 2021-09-06 09:30:09
-->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>

<body>
  <!--  -->
  <div id="myDiv">
    <div class="" id="div1">text</div>
    <div class="" id="div2">text</div>
  </div>
</body>

<script>
  var myDiv = document.getElementById("myDiv");
  console.log(myDiv);
  var div1 = document.getElementById("div1");
  console.log(div1);
  // 创建一个li节点
  var node = document.createElement("LI");
  // 创建一个text节点
  var textNode = document.createTextNode("Hello");
  // 将text节点追加到li节点上
  node.appendChild(textNode);
  // 找到id为myDiv的节点
  var myDiv = document.getElementById("myDiv");
  // 将刚刚创建的node节点追加为myDiv的子节点
  myDiv.appendChild(node);
</script>

</html>